<template>
  <div class="modelBox" id="ModelShop">
    <h2 class="title">
      <a href>
        <img src="../../../static/m_img/h_cx.png" alt>
        <span>TA的店铺</span>
      </a>
    </h2>
    <div class="shopInfo">
      <img :src="carDealerStore.storeHeadUrl" alt>
      <div class="info">
        <p class="shopName ellipsis-1">{{carDealerStore.storeName}}</p>
        <p class="ellipsis-1 barnd">主营品牌：宝马/奥迪/奔驰/玛莎拉蒂/宝马/奥迪/奔驰/玛莎拉蒂</p>
        <p class="sale">在售车辆：{{carDealerStore.onSaleCarNum}}辆</p>
        <a href="javascript:void(0)" @click="enterShop('Shop',miniStoreId)">进入TA的店铺</a>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data(){
    return{
   
    }
  },
  props: {
    carDealerStore: {
      storeHeadUrl:String
    },
    miniStoreId:Number
  },
  methods: {
    enterShop(name,miniStoreId) {
      this.$router.push({
        name: name,
        query: {
          miniStoreId:miniStoreId 
        }
      });
    }
  }
};
</script>
<style lang="scss">
#ModelShop {
  margin-top: 15px;
  .shopInfo {
    display: flex;
    margin-top: 15px;
    img {
      width: 100px;
      height: 100px;
      margin-right: 15px;
    }
    .info {
      width: 70%;
      .shopName {
        color: #323232;
        font-size: 1.333333rem;
        width: 100%;
      }
      .barnd,
      .sale {
        color: #666;
        margin-top: 2px;
        width: 100%;
      }
      a {
        color: #0098ff;
        width: 97.5px;
        height: 28px;
        display: block;
        border: 1px solid #0098ff;
        text-align: center;
        line-height: 28px;
        border-radius: 2px;
        margin-top: 2px;
      }
    }
  }
}
</style>
